<template>
    <div class="home-nav">
        <button @click="hiddenAction" :class="c1" :xian="isOk" style="float:left"></button>
        <p>首页</p>
        <p>/{{navarr[0]}}</p>
       <p>/{{navarr[1]}}</p>

    </div>
</template>

<script>
    export default {
        name: "HomeTopNav",
        props:["navarr"],
        isShow:true,
        data:function(){
            return{
                isOk:true,
                c1:"el-icon-s-fold",
                c2:"el-icon-s-unfold",
            }
        },
        methods:{
            hiddenAction(){
                this.isOk=!this.isOk;
                this.$emit("navaction");
                if (this.isOk==false){
                    this.c1="el-icon-s-unfold";
                }else {
                    this.c1="el-icon-s-fold";
                }
            }
        }
    }
</script>

<style scoped>
.home-nav{
    width: 100%;
    height: 30px;
    /*background-color: yellow;*/
    padding-top: 10px;
}
    p{
        float: left;
        line-height: 20px;
        text-align: center;
        margin-right: 5px;
    }
    button{
        height: 20px;
        width: 20px;
    }
</style>